<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title> QQ注册页面 </title>
</head>
<body>
 <!--页眉-->
 <header>
     <img src="./bg_chs.png" alt="">
     <h1>注册帐号</h1>
 </header>
  <!--主题-->
 <section>
     <form action="">
        <div>
            <labler for="1" >昵称</labler>
            <input id="1" type="text" pattern="[-\w\u4E00-\u9FA5]{4,10}">
            <labler>长度为4-10个字符</labler>
        </div>
        <br>
        <div>
            <labler>密码</labler>
            <input type="password" pattern="[\dA-Za-z]{6,16}">
            <labler>长度为6-16个字符</labler>
        </div>
        <br>
        <div>
            <labler>确认密码</labler>
            <input type="password" pattern="[\dA-Za-z]{6,16}">
            <labler>长度为6-16个字符</labler>
        </div>
        <br>
        <div>
            <labler>手机号</labler>
            <input type="text" pattern="1[3578]\d{9}">
            <labler>密码长度为11位，以13|5|7|8开头</labler>
        </div>
        <br>
        <div>
            <labler>邮箱</labler>
            <input type="email" >
        </div>
        <br>
        <div>
            <labler>年龄</labler>
            <input type="text" pattern="\d|[1-9]\d|1[0-2]\d">
        </div>
        <br>

        <button><img src="./btn.bmp" alt=""></button>


     </form>

 </section>  
  <!--页底--> 
 <footer>

 </footer>   
</body>
</html>